<?php
	include('header.php');
?>
	<header class="jumbotron subhead" id="overview">
	  <div class="container">
	    <h1>Search</h1>
	    <div class="row">
	    	<div class="col-xs-4">
			    <div class="input-group">
			    	<div class="input-group-btn">
			    		<button id="datatype" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" value="常规">常规 <span class="caret"></span></button>
				        <ul class="dropdown-menu" role="menu">
				          <li><a href="#">常规</a></li>
				          <li><a href="#">邮箱</a></li>
				          <li><a href="#">手机</a></li>
				          <li><a href="#">身份证</a></li>
				        </ul>
			    	</div>
			    	<input id="q" type="text" name="q" class="form-control">
			    	<span class="input-group-btn">
			    		<label id="search" class="btn btn-primary">查询</label>
			    	</span>
			    </div>
		   	</div>
	    <!--<input id="q" type="text" name="q"><label id="search" class="btn btn-primary">查询</label>-->
	    </div>
	    <div id='load' hidden><img src="image/load.gif" alt="Loading"></div>
	  </div>
	</header>
		<div class="container result">
			<div class="row">
				<div class="col-md-10 col-md-offset-1">
					<div id="result"></div>
				</div>
			</div>
			<div class="notifications bottom-right"></div>
		</div>
		<!-- jQuery -->
		<script>
		$(function(){
			prettyPrint();
		});
		$("#progress").hide();
		$("#load").hide();
		$("li:contains('Home')").attr('class','active');
		$("ul li a").click(function(){
			//this.text
			$("#datatype").html(this.text+' <span class="caret"></span>');
			$("#datatype").val(this.text);
		});
		$("#search").click(function(){
			$("#load").show(500);
			$.post('s.php',{'q':$("#q").val()},function(data){
				var s = '<div id="result" class="container"><div class="col-md-9 offset-md-3">';
				s = s+'<div class="panel panel-default"><div class="panel-heading">Query:'+$("#q").val();
				s = s+'</div>';
				s = s+'<table class="table table-striped table-condensed table-hover">';
				if (data.status == 'error') {
					$('.notifications').notify({message:{text:data.info},type:'blackgloss'}).show();
				} else  if (data.data == ''){
					$('.notifications').notify({message:{text:'没有找到数据'},type:'blackgloss'}).show();
				}else {
					for (var x in data.data) {
						if (data.data[x].info != undefined) {
							s = s + '<tr class="danger"><th colspan="3" align="right">'+data.data[x].info+'</th><tr>';
							continue;
						}
						s = s + '<tr class="success"><th colspan="3"><span class="label label-info">'+x+'</span><span class="badge badge-success">'+data.data[x].length+'</span></th><tr>';
						for (z in data.data[x]) {
							if (data.data[x][z]['u'] == 'undefined') data.data[x][z]['u'] = '木有';
						if (data.data[x][z]['p'] == 'undefined') data.data[x][z]['u'] = '木有';
						if (data.data[x][z]['e'] == 'undefined') data.data[x][z]['u'] = '木有';
						s = s + '<tr><td>'+data.data[x][z]['u']+'</td><td>'+data.data[x][z]['p']+'</td><td>'+data.data[x][z]['e']+'</td></tr>';
						}
						
					}
					s = s+'<tfoot><tr class="danger"><td colspan="3">'+data.time+'</td></tr></tfoot></table>';
					s = s+'</div></div></div>';
					$("#result").after(s);
				}
				$("#load").hide(1500);
				
			}, "json");
		});
		</script>
	</body>
</html>